<template>
	<view class="">
		<view class="infobox">
			<text>{{fromData.comment || '暂无评价'}}</text>
		</view>
		<view class="videolist">
			<view class="" v-for="(item,index) in fromData.image" :key="index">
				<image :src="item" mode="aspectFit"  @click="prew(item)"></image>
			</view>
		</view>
		<view class="item" v-for="(item,index) in evaluateList" :key="index">
			<text>{{item || '暂无'}}</text>
			<view class="imgs">
				<block v-for="(ele,i) in evaluateList2[index]*1" :key='i'>
					<image src="../static/icon_306@2x.png" mode="aspectFill"></image>
				</block>
				<block v-for="(ops,op) in 5-evaluateList2[index]*1" :key='op'>
					<image src="../static/icon_307@2x.png" mode="aspectFill"></image>
				</block>
			</view>
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				star1: 3,
				star2: 1,
				star3: 4,
				star4: 2,
				star5: 2,
				fromData: {}, //获取数据
				evaluateList: [], //评价名
				evaluateList2: [], //评价星
			}
		},
		onLoad(e) {
			if (uni.getStorageSync('data66')) {
				this.fromData = JSON.parse(uni.getStorageSync('data66'));
				console.log(this.fromData, 'data');
				this.evaluateList = Object.keys(this.fromData.other_star);
				this.evaluateList2 = Object.values(this.fromData.other_star);
				//暂时隐藏
				uni.removeStorageSync('data66');
			} else {
				uni.showToast({
					title: '获取评价失败',
					icon: 'none'
				})
			}
		},
		onShow() {},
		methods: {
			prew(e){
				uni.previewImage({
					current:e,
					urls:this.fromData.image
				})
			},
			setstar(e) {
				this.star1 = e + 1
			},
			setstar2(e) {
				this.star1 = this.star1 + e + 1
			},
			gogift() {
				uni.navigateTo({
					url: "./get_gift/index"
				})
			},


		}
	}
</script>

<style>
	.infobox {
		font-size: 26rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #333333;
		line-height: 46rpx;
		width: 690rpx;
		margin-left: 30rpx;
		box-sizing: border-box;
		padding: 20rpx 0;
	}

	.item {
		width: 690rpx;
		margin-left: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 50rpx;
	}

	.videolist {
		width: 690rpx;
		margin-left: 30rpx;
		display: flex;
		flex-wrap: wrap;

	}

	.videolist>view {
		width: 216rpx;
		height: 216rpx;
		border-radius: 8rpx;
		overflow: hidden;
		margin-left: 20rpx;
		margin-bottom: 20rpx;
	}

	.videolist>view:nth-of-type(3n+1) {
		margin-left: 0;
	}

	.videolist>view image,
	.videolist>view video {
		width: 100%;
		height: 100%;
	}

	.item text {
		font-size: 28rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #333333;
	}

	.imgs {
		display: flex;
		align-items: center;
	}

	.imgs>image {
		width: 40rpx;
		height: 40rpx;
		margin-left: 30rpx;
	}
</style>
